<template>
	<view class="container">
		<view class="head">
			<navigator @click="gotoarrow" class="return-arrow" v-if="reserve_id==0">
				<image class="return-img" src="../../../static/arrow.png"></image>
			</navigator>
			<view class="service-list" v-if="reserve_id==0">店务预约</view>
			<view class="service-list" v-if="reserve_id>0">用户预约</view>
		</view>
          
		  <!--切换项组件--> 
		  <invitedData :reserve_method="reserve_method" :reserve_id="reserve_id" :shop_user_list="shop_user_list" ></invitedData>
		
	</view>
</template>

<script>
	import minActionSheet from '@/components/min-action-sheet/min-action-sheet.vue';
    import invitedData from '@/components/appointment/invitedData.vue';
     export default {
        name: 'newCreate',
        components:{
            invitedData,minActionSheet
        },
        data() {
            return{  
				
				shop_list:[],
				shop_user_list:[],
				current_shop_name:"",
				current_shop_id:0,
				current_shop_phone:"",
				reserve_list:[],
                isShow:false,
				reserve_id:0,
				reserve_method:"",
                }
        },
		onLoad(event) {
			this.reserve_id=event.reserve_id !=undefined ? parseInt(event.reserve_id):0;
			this.reserve_method=event.reserve_method !=undefined ? event.reserve_method:"";
		},
		onShow() {
			this.current_shop_id=uni.getStorageSync("shop_id");
			this.current_shop_name=uni.getStorageSync("shop_name");
			this.current_shop_phone=uni.getStorageSync("shop_phone");
			
			this.getShopList(1);
			this.getData(1,50,1,0);
			//this.getCardList(1);
			this.getShopUserList(1);
		},
        methods:{
			gotoarrow(){
				this.$router.go(-1)
			},
			getShopUserList(){
				var where=this.current_shop_id;
				console.log(where);
				uni.request({
					url: uni.getStorageSync('api_url')+'/reserve/getShopBeauticianList?sId='+where,
					complete: (result) => {
						uni.hideLoading();
						if(result.data.code != 1){
							uni.showToast({
								title:result.data.msg,
								icon:'none'
							});
						}else{
							const data=result.data.data.data;
							this.shop_user_list=[];
							data.forEach((rst) => {
							this.shop_user_list.push(rst);	
							});
							
						}
						
					},
				});
			},getShopList(page=1,perPage=50){
				var where="";
				uni.request({
					url: uni.getStorageSync('api_url')+'/reserve/getShopList?&perPage='+perPage+'&page='+page+where,
					complete: (result) => {
						uni.hideLoading();
						if(result.data.code != 1){
							uni.showToast({
								title:result.data.msg,
								icon:'none'
							});
						}else{
							const data=result.data.data.data;
							data.forEach((rst) => {
							this.shop_list.push(rst);	
							});
							
						}
						
					},
				});
			},
			getData(page=1,perPage=50,newshop=0,status=0){
				var where="&userId="+uni.getStorageSync('user_id');
				if(this.current_shop_id>0){
					where+='&shopId='+this.current_shop_id;
				}
				where+='&status='+status;
				uni.request({
					url: uni.getStorageSync('api_url')+'/reserve/getList?&perPage='+perPage+'&page='+page+where,
					complete: (result) => {
						uni.hideLoading();
						if(result.data.code != 1){
							uni.showToast({
								title:result.data.msg,
								icon:'none'
							});
						}else{
							const data=result.data.data.data;
							if(newshop==1 || page==1){
								this.reserve_list=[];
							}
							data.forEach((rst) => {
								rst.service_img='/userCenter/static/missing-face.png';
							this.reserve_list.push(rst);	
							});
							
						}
						
					},
					});
			},
			shopAs() {
				const shop_data=[];
				this.shop_list.forEach((rst) => {
					shop_data.push({"id":rst.sId,"name":rst.sName,"phone":rst.sPhone,"address":rst.sAddress});	
				});
			  this.$refs.asshop.handleShow({
			    actions:shop_data,
			    success: (res) => {
					//console.log(res);			     				  
				  if (res.id < 0) {
						this.adv_text="未选择"
					 } else {
					//console.log(res);
						if(this.current_shop_id!=res.id){
							this.current_shop_id=res.id;
							this.current_shop_name=res.data.name;
							this.current_shop_phone=res.data.phone;
							console.log(this.current_shop_phone);
							this.getData(1,50,1);
							this.getServiceList(1);
							this.getShopUserList(1);
						}
						
					 } 
			    }
			  })
			},
        }
}
</script>

<style lang='scss'>
	.location-telephone{
		float: right;
		font-size: 15px;
		color: #cdcdcd;
		padding-right: 10px;
	}
	
	.icon-you{
		float: right;
	}
	.location-nane{
		float: left;
		font-size: 15px;
	}
	.location-icon{
	width: 1rem;
    height: 1rem;
    float: left;
    margin: 0.6rem;
	}
	button{
        padding-left: 0px;
		background-color: #ffffff;
		
	}
	.container{
		width: 96%;
		margin-left: 2%;
	}
	.tabs{
		width:100%;
		height: 40px;
		font-size: 0.8rem;
	}
	.text-tab{
    width: 33%;
	display: inline-block;
    text-align: center;
	float: left;
	margin: 15px 0px;
	}
	.active{		   
		text-shadow: 5px 5px 5px #ec4fae;
	}
	.store{margin-bottom: 10px;display: inline-block;width: 100%}
	.content{position: relative;}
	.appointment{
		font-size: 12px;
		line-height: 30px;
		padding: 0 8px !important;
		height: 30px;
		color: #fff;
		float: right;
		margin-bottom: 5px;
		background: #6d1c79;
		}
	.appointment2{
			width: 20%;
			font-size: 12px;
			line-height: 30px;
			padding: 0 8px !important;
			height: 30px;
			background: #6d1c79;
			float: right;
			margin-bottom: 5px;
		}
	.nane{
		float: left;
		width:65%;
		font-size: 14px;
		line-height: 30px;
		margin-left: 5%;
		}
	.pop-detail{font-size: 14px;line-height: 20px;}
	.nane .view{
			margin-left: 10px;
			padding: 3px 5px;
			color:#661F73 ;
			font-weight: bold;
			text-decoration: underline;
		}
	.nane-small{
			float: left;
			width:40%;
			font-size: 14px;
			line-height: 30px;
			margin-left: 5%;
		}
	.time{  margin-left:5%;  float: left; font-size: 14px;
		}
	.img-avatar{
			width: 25%;
			border-radius: 50%;
			float: left;
		}
	.list{
			display: inline-block;
			font-size: 0.8rem;
			border-radius: 5px;
			padding: 10px;
			margin-bottom: 1rem;
			background: #fffcfe;
		}
	.no-result {
			text-align: center;
			font-size: 16px;
		}
</style>
